<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>雷达详情</title>
	<link rel="stylesheet" href="/layui/css/layui.css">
	<style type="text/css">
		body{
			background: #f0f2f5;
		}
		/*公共头部带搜索*/
		.public_container{
			margin: 20px;
			background: #fff;
		}
		.public_title_container{
			height: 54px;
			padding: 0 20px;
			font-size: 14px;
			display: flex;
			align-items: center;
			background: #f9f9f9;
			border-bottom: 1px solid #f0f0f0;
			justify-content: space-between;
		}
		.public_title_container a{
			color: #2f54eb;
			cursor: pointer;
		}
		.public_buttonSearch_container{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20px;
			background: #fff;
		}
		.public_Search_container{
			position: relative;
		}
		.public_Search_container input{
			width: 240px;
			height: 32px;
			border: 1px solid #d9d9d9;
		}
		.public_Search_container i{
			position: absolute;
			bottom: 6px;
			right: 10px;
			cursor: pointer;
		}
		/*公共头部带搜索 end*/
		.public_table_container{
			padding: 0 20px 20px 20px;
		}
		.public_Search_content{
			display: flex;
		}
		.public_SearchSelect_content input{
			height: 32px;
		}
		.public_SearchSelect_content{
			margin-right: 10px;
		}
		.public_buttonSearch_content{
			display: flex;
			align-items: center;
		}
		.public_buttonSearch_content a{
			color: #fff;
			background-color: #2f54eb;
			text-shadow: 0 -1px 0 rgba(0,0,0,.12);
			height: 24px;
			padding: 4px 15px;
			font-size: 14px;
			border-radius: 2px;
			display: flex;
			align-items: center;
		}
		.public_buttonSearch_content span{
			color: rgba(0,0,0,0.65);
			background-color: #fff;
			height: 32px;
			padding: 4px 15px;
			font-size: 14px;
			border-radius: 2px;
			display: flex;
			align-items: center;
			border: 1px solid #d9d9d9;
			margin-left: 10px;
		}
		.public_buttonSearch_content p{
			font-size: 14px;
		}
		.public_buttonSearch_content p:first-child{
			color: rgba(18, 18, 22, 0.85);
			font-weight: 600;
		}
		.public_buttonSearch_content p:last-child{
			color: rgba(0,0,0,.45);
			cursor: pointer;
		}
		.public_buttonSearch_content b{
			height: 14px;
			background: #cdcdcd;
			width: 1px;
			margin: 0 8px;
		}
		/**/
		.public_userInfo_container img{
			width: 32px;
			height: 32px;
		}
		.public_userInfo_container{
			display: flex;
			align-items: center;
		}
		.public_userInfo_content{
			display: flex;
			height: 30px;
			justify-content: space-between;
			flex-direction: column;
			padding-left: 10px;
		}
		.public_userInfo_content p{
			font-size: 13px;
			color: #333;
			line-height: 13px;
		}
		.public_userInfo_content p:last-child{
			font-size: 12px;
			color: #999;
		}
		/**/
		.customerManagement_header_container{
			padding: 20px;
			background: #fff;
			margin: 20px;
		}
		.customerManagement_header_content{
			display: flex;
			align-items: center;
			margin-bottom: 15px;
		}
		.customerManagement_header_content:last-child{
			margin-bottom: 0;
		}
		.customerManagement_headerMain_container{
			display: flex;
			align-items: center;
			flex: 1;
		}
		.customerManagement_headerMain_container p{
			color: rgba(0,0,0,.65);
			font-size: 14px;
			word-break: keep-all;
			text-align: right;
			min-width: 93px;
		}
		.customerManagement_headerMainButton_container{
			justify-content: flex-end;
		}
		.customerManagement_headerMainButton_container button{
			padding: 5px 16px;
			font-size: 14px;
			width: 65px;
			height: 32px;
			background: #fff;
			outline: none;
			appearance: none;
			border: 1px solid #e6e6e6;
			cursor: pointer;
		}
		.customerManagement_headerMainInput{
			border: 1px solid #e6e6e6;
			display: flex;
			align-items: center;
			flex: 1;
			justify-content: space-between;
		}
		.customerManagement_headerMainInput input{
			font-size: 14px;
			border: none;
			flex: 1;
			height: 32px;
			border-radius: 3px;
		}
		.customerManagement_headerMainInput svg{
			fill: #c2c2c2;
			width: 20px;
			height: 20px;
			margin-right: 5px;
			cursor: pointer;
		}
		.customerManagement_select_container{
			flex: 1;
		}
		/*雷达上半部分*/
		.radardetail_main_container{
			display: flex;
			padding:20px 20px 0 20px;
		}
		.radardetail_condition_container{
			padding-right: 20px;
			padding-bottom: 10px;

		}
		.radardetail_mainInfo_container{
			padding: 30px 24px 36px;
			background: #fff;
			flex: 1;
			margin-right: 16px;
		}
		.radardetail_mainInfo_content{
			overflow: hidden;
		}
		.radardetail_mainInfo_content li{
			margin-bottom: 15px;
			width: 50%;
			float: left;
			display: flex;
			align-items: center;
			flex-wrap: wrap;
		}
		.radardetail_mainInfo_content li span{
			color: rgba(0,0,0,.45);
			font-size: 14px;
		}
		.radardetail_mainInfo_content li p{
			color: #222;
			font-size: 14px;
			flex: 1;
		}
		.radardetail_dataDetail_container{
			flex: 1;
			background: #fff;
		}
		.radardetail_dataDetail_container h2{
			padding: 17px 0 12px 24px;
			border-bottom: 1px solid #e9ebf3;
			font-size: 15px;
			font-weight: 500;
			color: #333;
			line-height: 21px;
		}
		.radardetail_dataDetail_content{
			padding: 37px 24px;
		}
		.radardetail_dataDetail_list{
			background: #fbfdff;
			border: 1px solid #daedff;
			display: flex;
		}
		.radardetail_dataDetail_list li{
			flex: 1;
			margin: 20px 0;
			border-right: 1px solid #e9e9e9;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}
		.radardetail_dataDetail_list li b{
			font-size: 24px;
			font-weight: 500;
			color: #000;
			line-height: 33px;
		}
		.radardetail_dataDetail_list li span{
			font-size: 13px;
			font-weight: 400;
			color: rgba(0,0,0,.65);
			line-height: 18px;
		}
	</style>
</head>
<body>
	<div class="radardetail_main_container">
		<div class="radardetail_mainInfo_container">
			<ul class="radardetail_mainInfo_content">
				<li>
					<span>链接标题：</span>
					<p>{$radar->link_title}</p>
				</li>
				<!-- <li>
					<span>创建者：</span>
					<p>张经理</p>
				</li> -->
				<li>
					<span>原链接：</span>
					<p>{$radar->link}</p>
				</li>
				<li>
					<span>创建时间：</span>
					<p>{$radar->ctime}</p>
				</li>
				<li>
					<span>动态通知：</span>
					<p>{$radar->dynamic_inform == 1 ? '已开启' : '已关闭'}</p>
				</li>
				<li>
					<span>行为通知：</span>
					<p>{$radar->behavior_inform == 1 ? '已开启' : '已关闭'}</p>
				</li>
				<li>
					<span>客户标签：</span>
					<p>{$radar->e_tag}</p>
				</li>
			</ul>
		</div>
		<div class="radardetail_dataDetail_container">
			<h2>数据详情</h2>
			<div class="radardetail_dataDetail_content">
				<ul class="radardetail_dataDetail_list">
					<li>
						<b>{$statistics['total_clnum']??0}</b>
						<span>总点击人数</span>
					</li>
					<li>
						<b>{$statistics['total_clamount']??0}</b>
						<span>总点击次数</span>
					</li>
					<li>
						<b>{$statistics['today_total_clnum']??0}</b>
						<span>今日点击人数</span>
					</li>
					<li>
						<b>{$statistics['today_total_clamount']??0}</b>
						<span>今日点击次数</span>
					</li>
				</ul>
			</div>
			
		</div>
	</div>
	
	<form class="layui-form">
	<div class="public_container">
		<div class="public_content">
			<div class="public_buttonSearch_container">
				<div class="public_buttonSearch_content">
					<p>打开链接的客户({count($externalcontact_list)})</p>
					<b></b>
					<p onclick="location.reload()">更新数据</p>
				</div>
			</div>
		</div>
		<div class="radardetail_condition_container">
			<div class="customerManagement_header_content">
				<!-- <div class="customerManagement_headerMain_container">
					<p>搜索客户：</p>
					<div class="customerManagement_headerMainInput">
						<input type="text" class="layui-input"  placeholder="请输入姓名">
						<svg t="1600867351980" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1194" width="200" height="200"><path d="M920.4 883.6L734.9 698.1c55.4-63.9 89.1-147 89.1-238.1 0-201-163-364-364-364S96 259 96 460s163 364 364 364c91.2 0 174.3-33.7 238.1-89.1l185.5 185.5c4.7 4.7 11.2 7.6 18.4 7.6 14.4 0 26-11.6 26-26 0-7.2-2.9-13.7-7.6-18.4zM460 772c-172 0-312-140-312-312s140-312 312-312 312 140 312 312-140 312-312 312z" p-id="1195"></path></svg>
					</div>
				</div> -->
				<!-- <div class="customerManagement_headerMain_container">
					<p>点击渠道：</p>
					<div class="customerManagement_select_container">
					    <select name="city" lay-verify="required">
					      <option value=""></option>
					      <option value="0">北京</option>
					      <option value="1">上海</option>
					      <option value="2">广州</option>
					      <option value="3">深圳</option>
					      <option value="4">杭州</option>
					    </select>
					</div>
				</div> -->
				<!-- <div class="customerManagement_headerMain_container">
					<p>时间筛选：</p>
					<input type="text" class="layui-input" id="test6" placeholder="点击选择日期范围">
				</div> -->
				<!-- <div class="customerManagement_headerMain_container">
					<p>所属客服：</p>
					<div class="customerManagement_select_container">
					    <select name="city" lay-verify="required">
					      <option value=""></option>
					      <option value="0">北京</option>
					      <option value="1">上海</option>
					      <option value="2">广州</option>
					      <option value="3">深圳</option>
					      <option value="4">杭州</option>
					    </select>
					</div>
				</div> -->
			</div>
		</div>

		</form>
		<!-- /*公共头部带搜索*/ end -->
		<!-- 公共表格部分 -->

		<div class="public_table_container">
			<table class="layui-table" >
			  <colgroup>
			      <col>
			      <col>
			      <col>
			    </colgroup>
			    <thead>
			      <tr>
			        <th>客户</th>
			        <th>所属成员</th>
			        <th>最近点击时间</th>
			        <!-- <th>最近点击渠道</th> -->
			        <th>客户点击次数</th>
			        <!-- <th>操作</th> -->
			      </tr> 
			    </thead>
			    <tbody>
			    	{loop $externalcontact_list as  $externalcontact}
			        <tr>
			        	<td>
			        		<div class="public_userInfo_container">
			        			<img src="{$externalcontact['avatar']}">
			        			<div class="public_userInfo_content">
			        				<p>{$externalcontact['remark'] ?: $externalcontact['name']}</p>
			        				<p>昵称：{$externalcontact['name']}</p>
			        			</div>
			        		</div>
			        	</td>
			        	<td>{$h->get_user_by_id($externalcontact['wid'],$externalcontact['user_id'])['name']}</td>
			        	<td>{date('Y-m-d H:i:s',$externalcontact['geren_last_ctime'])}</td>
			        	<!-- <td>渠道A</td> -->
			        	<td>{$externalcontact['geren_claount']}</td>
			        	<!-- <td>
			        		<button type="button" class="layui-btn layui-btn-sm layui-btn-normal">详情</button>
			        	</td> -->
			      	</tr>
			      	{/loop}
			    </tbody>
			</table>
		</div>
		<!-- 公共表格部分 end-->
	</div>
	
	<script src="/cdn/jquery.js"></script>
	<script src="/layui/layui.js"></script>
	<script type="text/javascript">
		layui.use('form', function(){
		  var form = layui.form;
		  	
		  //监听提交
		  form.on('submit(formDemo)', function(data){
		    layer.msg(JSON.stringify(data.field));
		    return false;
		  });
		  form.render('select');
		});
		layui.use('laydate', function(){
  			var laydate = layui.laydate;
  			//日期范围
  			  laydate.render({
  			    elem: '#test6'
  			    ,range: true
  			  });
  		});
	</script>
</body>
</html>